<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>模仿天猫的手机页面</title>
		<link rel="stylesheet" href="../../../css/phone.css" />
	</head>
	<body>
		
		<!--
        	作者：offline
        	时间：2016-11-08
        	描述：最外面的div 容器 测试页面 最简单的办法。就是加边框
        -->
		<div id="container">
			
			<!--1个手机开始-->
			<div class="phone b">
				
				<!-- 图片的div开始 -->
				<div class="phoneDiv">
					<img src="../../../img/phone.jpg" style="height: 228px;" />
				</div>
				<!-- 图片的div结束 -->
				
				<!-- 设置手机的名称和容量 开始-->
				<div class="nameAndContainDiv">
					iPhone 7 32G
				</div>
				<!-- 设置手机的名称和容量 结束-->
				
				<!-- 分期的代码开始 -->
				<div class="fx">
					尾款12期分期免息
				</div>
				<!-- 分期的代码结束 -->
				
				<!--到手价 开始-->
				<div class="price">
					<div class="hand1">到手价：</div>
					<div class="money">￥</div>
					<div class="hand2">4688</div>
				</div>
				<!--到手价 结束-->
				<div>
					<div class="booking">立即预定 &gt;</div>
				</div>
			</div>
			<!--1个手机开始-->
			<!--1个手机开始-->
			<div class="phone b">
				
				<!-- 图片的div开始 -->
				<div class="phoneDiv">
					<img src="../../../img/phone.jpg" style="height: 228px;" />
				</div>
				<!-- 图片的div结束 -->
				
				<!-- 设置手机的名称和容量 开始-->
				<div class="nameAndContainDiv">
					iPhone 7 32G
				</div>
				<!-- 设置手机的名称和容量 结束-->
				
				<!-- 分期的代码开始 -->
				<div class="fx">
					尾款12期分期免息
				</div>
				<!-- 分期的代码结束 -->
				
				<!--到手价 开始-->
				<div class="price">
					<div class="hand1">到手价：</div>
					<div class="money">￥</div>
					<div class="hand2">4688</div>
				</div>
				<!--到手价 结束-->
				<div>
					<div class="booking">立即预定 &gt;</div>
				</div>
			</div>
			<!--1个手机开始-->
			<!--1个手机开始-->
			<div class="phone b">
				
				<!-- 图片的div开始 -->
				<div class="phoneDiv">
					<img src="../../../img/phone.jpg" style="height: 228px;" />
				</div>
				<!-- 图片的div结束 -->
				
				<!-- 设置手机的名称和容量 开始-->
				<div class="nameAndContainDiv">
					iPhone 7 32G
				</div>
				<!-- 设置手机的名称和容量 结束-->
				
				<!-- 分期的代码开始 -->
				<div class="fx">
					尾款12期分期免息
				</div>
				<!-- 分期的代码结束 -->
				
				<!--到手价 开始-->
				<div class="price">
					<div class="hand1">到手价：</div>
					<div class="money">￥</div>
					<div class="hand2">4688</div>
				</div>
				<!--到手价 结束-->
				<div>
					<div class="booking">立即预定 &gt;</div>
				</div>
			</div>
			<!--1个手机开始-->
			<!--1个手机开始-->
			<div class="phone">
				
				<!-- 图片的div开始 -->
				<div class="phoneDiv">
					<img src="../../../img/phone.jpg" style="height: 228px;" />
				</div>
				<!-- 图片的div结束 -->
				
				<!-- 设置手机的名称和容量 开始-->
				<div class="nameAndContainDiv">
					iPhone 7 32G
				</div>
				<!-- 设置手机的名称和容量 结束-->
				
				<!-- 分期的代码开始 -->
				<div class="fx">
					尾款12期分期免息
				</div>
				<!-- 分期的代码结束 -->
				
				<!--到手价 开始-->
				<div class="price">
					<div class="hand1">到手价：</div>
					<div class="money">￥</div>
					<div class="hand2">4688</div>
				</div>
				<!--到手价 结束-->
				<div>
					<div class="booking">立即预定 &gt;</div>
				</div>
			</div>
			<!--1个手机开始-->
		</div>
	</body>
</html>
